<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1.0, maximum-scale=1">
        <meta name="description" content="Metro UI CSS">
        <meta name="author" content="Sergey Pimenov">
        <meta name="keywords" content="windows 8, modern style, Metro UI, style, modern, css, framework">

        <link href="css/modern.css" rel="stylesheet">
        <link href="css/modern-responsive.css" rel="stylesheet">
        <link href="css/site.css" rel="stylesheet" type="text/css">
        <link href="js/google-code-prettify/prettify.css" rel="stylesheet" type="text/css">

        <script type="text/javascript" src="js/assets/jquery-1.9.0.min.js"></script>
        <script type="text/javascript" src="js/assets/jquery.mousewheel.min.js"></script>
        <script type="text/javascript" src="js/assets/moment.js"></script>
        <script type="text/javascript" src="js/assets/moment_langs.js"></script>

        <script type="text/javascript" src="js/modern/dropdown.js"></script>
        <script type="text/javascript" src="js/modern/accordion.js"></script>
        <script type="text/javascript" src="js/modern/buttonset.js"></script>
        <script type="text/javascript" src="js/modern/carousel.js"></script>
        <script type="text/javascript" src="js/modern/input-control.js"></script>
        <script type="text/javascript" src="js/modern/pagecontrol.js"></script>
        <script type="text/javascript" src="js/modern/rating.js"></script>
        <script type="text/javascript" src="js/modern/slider.js"></script>
        <script type="text/javascript" src="js/modern/tile-slider.js"></script>
        <script type="text/javascript" src="js/modern/tile-drag.js"></script>
        <script type="text/javascript" src="js/modern/calendar.js"></script>
        <script type="text/javascript">
            function place()
            { 
                var user= document.getElementsByName("username")[0].value ;
                if(user=="")
                {document.getElementsByName("username")[0].value = "Username";}
                var pwd= document.getElementsByName("password")[0].value.toString();
                if(pwd=="")
                {document.getElementsByName("password")[0].value = "Password";}
            
            }
            function vanish()
            { 
                var user= document.getElementsByName("username")[0].value;
                if(user!="Username")
                {}
                else
                {document.getElementsByName("username")[0].value = "";
                }
            
            }
            function place_p()
            { 
                var pwd= document.getElementsByName("password")[0].value.toString();
                if(pwd=="")
                {document.getElementsByName("password")[0].value = "Password";}
            
            
            }
            function vanish_p()
            {  
                var pwd= document.getElementsByName("password")[0].value;
                if(pwd!="Password")
                {}
                else
                {document.getElementsByName("password")[0].value = "";
                }
             
            }
        </script>
        <title>Metro UI CSS</title>
    </head>
    <body class="metrouicss" onload="prettyPrint();place();place_p();">

        <?php include("navigation.php")?>

        <div class="page secondary">



            <div class="page-region">
                <div class="page-region-content">
                    <FORM name="example_form" action="#" method="POST">  
                        <h3>School Details</h3>
                        <div>
                            <table id="1">
                                <tr><td>School Name</td><td><input onclick="vanish();" onblur="place();" name="username" id="autocomplete" title="type "a"">
                                    </td></tr>
                                <tr><td>Address</td>
                                    <td><input  onclick="vanish_p();" onblur="place_p();" name="password" id="autocomplete" title="type "a"">
                                    </td></tr>
                            </table>
                        </div>




                </div>

                </br>
                <button id="staticDialog">SignIn</button>
 <button id="staticDialog">SignUp</button>
 <a href="">Forgot password?</a>
                </FORM>           
            </div>            
            <!--button id="setupDialog">Setup dialog</button-->
            <script type="text/javascript" src="js/modern/dialog.js"></script>
            <script type="text/javascript">
                $(document).ready(function(){
                    $('#staticDialog').click(function(e) {
                        var i=document.getElementById("t").value;
                        if(i=="")
                        {
                            $.Dialog({
                                'title'      : 'My static dialog',
                                'content'    : 'This kand can be in HTML.<br />You can add custom function to your buttons!<br /><br /><b>Features:</b><ul><li>Easy to use!</li><li>Customizable</li><li>Powerful!</li></ul>',
                                'buttons'    : {
                                    'Ok'    : {
                                        'action': function() {}
                                    },
                                    'Cancel'     : {
                                        'action': function() {}
                                    }
                                }
                            });
                            return false;   
                        }
                    }); 
                });
            </script>

            <script type="text/javascript" src="js/assets/github.info.js"></script>
            <script type="text/javascript" src="js/assets/google-analytics.js"></script>
            <script type="text/javascript" src="js/google-code-prettify/prettify.js"></script>
            <script src="js/sharrre/jquery.sharrre-1.3.4.min.js"></script>

            <script>
                $('#shareme').sharrre({
                    share: {
                        googlePlus: true
                        ,facebook: true
                        ,twitter: true
                        ,delicious: true
                    },
                    urlCurl: "js/sharrre/sharrre.php",
                    buttons: {
                        googlePlus: {size: 'tall'},
                        facebook: {layout: 'box_count'},
                        twitter: {count: 'vertical'},
                        delicious: {size: 'tall'}
                    },
                    hover: function(api, options){
                        $(api.element).find('.buttons').show();
                    }
                });
            </script>

    </body>
</html>